<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="/css/userDialog.css" type="text/css" rel="stylesheet">

</head>
<body>
<div th:include="common/inc"></div>
<!--<div class="dialog-wrap startchat-dialog">-->
<!--    <div class="dialog-container">-->
<!--        <div class="dialog-title">-->
<!--            <h3 class="title">-->
<!--                <div class="startchat-title">-->
<!--                    <img class="avatar" src="/images/logo1.png">-->
<!--                    <div class="boss-info">-->
<!--                        <div class="name">公司</div>-->
<!--                        <div class="position">招聘者</div>-->
<!--                    </div>-->
<!--                </div>-->
<!--            </h3>-->
<!--        </div>-->
<!--        <div class="dialog-con">-->
<!--            <div class="startchat-content">-->
<!--                <div class="left">-->
<!--                    <div class="message">-->
<!--                        <ul class="message-list" id="showwindows">-->
<!--                            &lt;!&ndash;   后台传过来的集合按informationId排序     &ndash;&gt;-->
<!--                            <div>-->
<!--                                <div>-->
<!--                                    <li class="message-item-right message-item">-->
<!--                                        <p class="right-text" >11111</p>-->
<!--                                    </li>-->
<!--                                </div>-->
<!--                                <div>-->
<!--                                    <li class="message-item-left message-item">-->
<!--                                        <p class="left-text">222222</p>-->
<!--                                    </li>-->
<!--                                </div>-->
<!--                                <div>-->
<!--                                    <li class="message-item-right message-item">-->
<!--                                        <p class="right-text" >333333</p>-->
<!--                                    </li>-->
<!--                                </div>-->
<!--                                <div>-->
<!--                                    <li class="message-item-left message-item">-->
<!--                                        <p class="left-text">444444</p>-->
<!--                                    </li>-->
<!--                                </div>-->
<!--                                <div>-->
<!--                                    <li class="message-item-right message-item">-->
<!--                                        <p class="right-text" >555555</p>-->
<!--                                    </li>-->
<!--                                </div>-->
<!--                                <div>-->
<!--                                    <li class="message-item-left message-item">-->
<!--                                        <p class="left-text">666666</p>-->
<!--                                    </li>-->
<!--                                </div>-->
<!--                                <div>-->
<!--                                    <li class="message-item-left message-item">-->
<!--                                        <p class="left-text">777777</p>-->
<!--                                    </li>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                        </ul>-->
<!--                    </div>-->
<!--                    <div class="edit-area">-->
<!--                        <form style="width: 100%">-->
<!--                            <textarea class="input-area" id="messageContent"  name="messageContent" placeholder="请简短描述您的问题"></textarea>-->
<!--                        </form>-->
<!--                        <div class="send-message" style="width: 60px;" onclick="addMessage()">回复</div>-->
<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
<!--        </div>-->
<!--    </div>-->
<!--</div>-->
<div class="dialog-wrap startchat-dialog">
    <div class="dialog-container">
        <div class="dialog-title">
            <h3 class="title">
                <div class="startchat-title">
                    <img class="avatar" src="/images/logo1.png">
                    <div class="boss-info">
                        <!--<div class="name" th:text="${information.company.companyName}"></div>-->
                        <div class="name" th:text="${information.name}"></div>
                        <!--<div class="position">招聘者</div>-->
                    </div>
                </div>
            </h3>
        </div>
        <div class="dialog-con">
            <div class="startchat-content">
                <div class="left">
                    <div class="message">
                        <ul class="message-list" id="showwindows">
                            <!--   后台传过来的集合按informationId排序     -->
                            <div th:each="me:${information.informationList}">
                                <div th:if="${me.sender eq session.user.userId}">
                                    <li class="message-item-right message-item">
                                        <p class="right-text" th:text="${me.messageContent}"></p>
                                    </li>
                                </div>
                                <div th:if="${me.sender ne session.user.userId}">
                                    <li class="message-item-left message-item">
                                        <p class="left-text" th:text="${me.messageContent}"></p>
                                    </li>
                                </div>
                            </div>
                        </ul>
                    </div>
                    <div class="edit-area">
                        <!--   消息发一条，存一条，addMessage()传给后台一个informationList对象，informationId默认递增   -->
                        <form style="width: 100%">
                            <input type="hidden" name="userId" th:value="${information.userId}">
                            <input type="hidden" name="companyId" th:value="${information.companyId}">
                            <input type="hidden" name="positionId" th:value="${information.positionId}">
                            <textarea class="input-area" id="messageContent" name="messageContent" placeholder="请简短描述您的问题"></textarea>
                        </form>
                            <div class="send-message" onclick="addMessage()">回复</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script>
    $(function (){
        var div = document.getElementById('showwindows');
        div.scrollTop = div.scrollHeight;
    })
    function addMessage(){
        var messageContent = $("#messageContent").val();
        if(messageContent != "" && messageContent != null){
            $.ajax({
                url:"/information/addInformation",
                type:"post",
                data:$("form").serialize(),
                success:function(){
                    //发送成功重新加载页面，把刚发的消息展示
                    location.reload();
                },error:function(){
                    alert("发送失败");
                }
            })
        }else {
            alert("发送内容不能为空");
        }

    }
</script>
</html>